<!DOCTYPE html>
<html>
	<head>
		<!-- 设置浏览器不缓存 -->
		<META HTTP-EQUIV="pragma" CONTENT="no-cache">
		<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
		<META HTTP-EQUIV="expires" CONTENT="0">
		<!-- Content-Type -->
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<!-- Favicon -->
		<link rel="shortcut icon" href="./images/logo.png">
		<title>企业服务共享中心-薪资构成</title>
		<!--stylesheets-->
		<link rel="stylesheet" href="./plugins/element/index.css">
		<script src="./plugins/vue/vue.js"></script>
		<script src="./plugins/element/index.js"></script>
		<script src="./plugins/axios/axios.min.js"></script>
		<script src="./plugins/QRCode/qrcode.js"></script>
		<script src="./js/common/public.js?v=0.8.0.3"></script>
		<!-- 自定义样式表 -->
		<link rel="stylesheet" href="./css/base.css?v=0.8.0.3">
	</head>
	<body>
		<div id="app">
			<template>
				<el-container class="maincontainer">

						<el-card class="box-card" style="width:100%" shadow="never">
							<div slot="header" class="clearfix">
								<i v-on:click="showLeftBar()" v-bind:class="[leftbar_show ? 'el-icon-s-fold' : 'el-icon-s-unfold']" style="color:#409EFF;cursor:pointer;"></i>
								<span>薪资构成</span>
								<el-button-group style="float:right;margin-top:0px;">
									<el-button size="small" icon="el-icon-document" type="primary" @click="dialogimportFormVisible = true">添加</el-button>
								</el-button-group>
							</div>
							<div>
								<el-table  border ref="multipleTable" :data="pagedata" tooltip-effect="dark" :height="tableHeight"
								 style="width: 100%;" size="medium" @select='selectionChange' @selection-change="handleSelectionChange">>
									<el-table-column type="selection" min-width="100" align="center">
									</el-table-column>
									<el-table-column
									v-for="column in tablecolums"
									  v-bind:prop="column.prop"
									  v-bind:label="column.label"
									  v-bind:min-width="column.width"
									  show-overflow-tooltip>
									</el-table-column>
									<el-table-column label="操作" min-width="30" align="center">
									  <template slot-scope="scope" align="center">
											<el-link type="primary"@click="dialogimportFormVisible = true">编辑</el-link>
									  </template>
									</el-table-column>		
								</el-table>
								
				<el-dialog :close-on-click-modal="false" title="项目信息" :visible.sync="dialogimportFormVisible" width="500px">
					<el-form :model="importForm" ref="importForm" label-width="80px" :rules="Xiangmurules">
						<el-row :gutter="20">
							<el-col :span="24" style="padding-left: 50px;">
								<el-form-item label="项目名称" prop="name">
									<el-select v-model="importForm.name" placeholder="请选择" filterable clearable>					
										<el-option v-for="item in names" :key="item.id" :label="item.name" :value="item.id">
										</el-option>
									</el-select>
								</el-form-item>
							<el-col>
						</el-row>
						<el-row :gutter="20">
							<el-col :span="18" style="padding-left: 50px;">
								<el-form-item label="金额" prop="money">
									<el-input v-model="importForm.money" ></el-input>
								</el-form-item>
							</el-col>
						</el-row>
					</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="dialogimportFormVisible = false">取 消</el-button>
				<el-button type="primary" @click="confirmService" :disabled="submitDisable">确 定</el-button>
			</div>					
				</el-dialog>

								<div style="margin-top: 20px">
									<el-pagination @current-change="handleCurrentPageChange" :current-page="queryForm.pageNo" :page-sizes="queryForm.pagesizes"
									 background layout="total,sizes, prev, pager, next" :total="pagetotal">
									</el-pagination>
								</div>
							</div>
						</el-card>
					</el-container>
				</el-container>

				
<


				<el-dialog :visible.sync="imgdialogVisible">
					<img width="100%" :src="imgdialogImageUrl" alt="">
				</el-dialog>
			</template>
		</div>
	</body>
	<script src="./js/salarycomponent.js?v=0.8.0.3"></script>
</html>
